/*
 * Dynamic Image Borders v2.0
 *
 * Copyright (c) 2008 Daniel Marino (iamdanielmarino.com)
 * Creative Commons Attribution 3.0 United States License
 *
 * Date: 07-14-2008
 */

//------------------------------------------------------------

// borderWidth is to be set to the number
// of pixels the size of the border is

var borderWidth = 10;

// imgFolder is to be set to the directory
// that the images are located in

var imgFolder = "images";

//------------------------------------------------------------

function windowOnLoad(f) {
	
	var prev = window.onload;
	window.onload = function() { if (prev) prev(); f(); }
	
}


function getElementsByClass(searchClass) {

	var classElements = new Array();
	var els = document.getElementsByTagName('*');
	var elsLen = els.length;
	var pattern = new RegExp("\\b"+searchClass+"\\b");

	for (i = 0, j = 0; i < elsLen; i++) {

		if (pattern.test(els[i].className)) {

			classElements[j] = els[i];
			j++;

		 }
	}

	return classElements;

}

function addShadow() {

	var source = getElementsByClass('shadow');
	
	for (i = 0; i < source.length; i++) {

	newWidth = source[i].width + (borderWidth * 2);

	/* new page fragment */
	var fragment = document.createDocumentFragment();
	
	source[i].style.padding = '0 10px';
	source[i].style.backgroundImage = 'url(' + imgFolder + '/img-m-l.gif)';
	source[i].style.backgroundRepeat = 'repeat-y';	
	source[i].style.backgroundPosition = 'left';
	
	/* div.imgContain */
	var imgContain = document.createElement("div");
	imgContain.setAttribute('class', 'imgContain');
	imgContain.style.width = newWidth + 'px';
	imgContain.style.fontSize = '0';
	imgContain.style.backgroundImage = 'url(' + imgFolder + '/img-m-r.gif)';
	imgContain.style.backgroundRepeat = 'repeat-y';	
	imgContain.style.backgroundPosition = 'right';
	
	/* div.imgHead */
	var imgHead = document.createElement("div");
	imgHead.setAttribute('class', 'imgHead');
	imgHead.style.height = '10px';
	imgHead.style.backgroundImage = 'url(' + imgFolder + '/img-t-c.gif)';
	imgHead.style.backgroundRepeat = 'repeat-x';
	

	/* div.tl */
	var tl = document.createElement("div");
	tl.setAttribute('class', 'tl');
	tl.style.width = '10px';
	tl.style.height = '10px';
	tl.style.cssFloat = 'left';
	tl.style.styleFloat = 'left';
	tl.style.backgroundImage = 'url(' + imgFolder + '/img-t-l.gif)';	

	/* div.tr */
	var tr = document.createElement("div");
	tr.setAttribute('class', 'tr');
	tr.style.width = '10px';
	tr.style.height = '10px';
	tr.style.cssFloat = 'right';
	tr.style.styleFloat = 'right';
	tr.style.backgroundImage = 'url(' + imgFolder + '/img-t-r.gif)';
	
	/* div.imgFoot */
	var imgFoot = document.createElement("div");
	imgFoot.setAttribute('class', 'imgFoot');
	imgFoot.style.height = '10px';
	imgFoot.style.backgroundImage = 'url(' + imgFolder + '/img-b-c.gif)';
	imgFoot.style.backgroundRepeat = 'repeat-x';	

	/* div.bl */
	var bl = document.createElement("div");
	bl.setAttribute('class', 'bl');
	bl.style.width = '10px';
	bl.style.height = '10px';
	bl.style.cssFloat = 'left';
	bl.style.styleFloat = 'left';
	bl.style.backgroundImage = 'url(' + imgFolder + '/img-b-l.gif)';
	
	/* div.br */
	var br = document.createElement("div");
	br.setAttribute('class', 'br');
	br.style.width = '10px';
	br.style.height = '10px';
	br.style.cssFloat = 'right';
	br.style.styleFloat = 'right';
	br.style.backgroundImage = 'url(' + imgFolder + '/img-b-r.gif)';

	/* Put them all together now */
	imgHead.appendChild(tl);
	imgHead.appendChild(tr);
	imgFoot.appendChild(bl);
	imgFoot.appendChild(br);
	imgContain.appendChild(imgHead);
	imgContain.appendChild(source[i].cloneNode(true));
	imgContain.appendChild(imgFoot);

	/* put imgContain in page fragment */
	fragment.appendChild(imgContain);

	/* replace source with new fragment (contains a copy of source) */
	source[i].parentNode.replaceChild(fragment, source[i]);
	
	}
	
}

windowOnLoad(addShadow);